import { useSelector } from 'react-redux'
import type { RootState } from '../../store/index'
import { useSearchParams } from 'react-router-dom'
const Detail = () => {

  const [searchParams] = useSearchParams()
  console.log(searchParams.get('name'))
  const selected = useSelector((state:RootState) => state.food.selected)
  console.log(selected)
  const list = selected.filter(item => item.name === searchParams.get('name'))
  console.log(list)


  return (
    <div>
      {list.map(item =>
        <div key={item.name}>
          <p>{item.name}</p>
          <img src={item.imgUrl} alt="" />
          <p>{item.content}</p>
        </div>
      )}
    </div>
  )
}

export default Detail